<template>
    <el-table v-loading="loading" element-loading-spinner="el-icon-loading" border size="mini" class="small-size-table"
        :data="[data]" style="width: 100%" highlight-current-row header-align="center" :header-cell-style="getRowClass">
        <el-table-column prop="proxyName" align="center" label="代理账号">
            <template slot-scope="scope">
                {{ scope.row.proxyName }}
            </template>
        </el-table-column>
        <el-table-column prop="shouldReceiptPaymentParentAmount" align="center" label="应收/应付上级">
            <template slot="header" slot-scope="{ column, $index }">
                应收/应付上级
                <span>
                    <el-tooltip class="item" effect="dark" content="本期团队盈亏+其他资金变动+上期应收上级-上期应付上级＞0的金额"
                        placement="top-start">
                        <i class="el-icon-question"></i>
                    </el-tooltip>
                </span>
            </template>
            <template slot-scope="scope">
                <formItem :scope="scope" :updateData="updateData" />
            </template>
        </el-table-column>
        <el-table-column prop="shouldReceiptChildAmount" align="center" label="应收下级">
            <template slot="header" slot-scope="{ column, $index }">
                <span>
                    应收下级
                    <el-tooltip class="item" effect="dark" content="汇总当期应收下级的总额" placement="top-start">
                        <i class="el-icon-question"></i>
                    </el-tooltip>
                </span>
            </template>
            <template slot-scope="scope">
                <formItem :scope="scope" :updateData="updateData" />
            </template>
        </el-table-column>
        <el-table-column prop="shouldPaymentChildAmount" align="center" label="应付下级">
            <template slot="header" slot-scope="{ column, $index }">
                <span>
                    应付下级
                    <el-tooltip class="item" effect="dark" content="汇总当期应付下级的总额" placement="top-start">
                        <i class="el-icon-question"></i>
                    </el-tooltip>
                </span>
            </template>
            <template slot-scope="scope">
                <formItem :scope="scope" :updateData="updateData" />
            </template>
        </el-table-column>
        <el-table-column prop="personShouldReceiptPaymentAmount" align="center" label="本期个人应收/应付">
            <template slot="header" slot-scope="{ column, $index }">
                <span>
                    <!-- {{
                          data.personShouldReceiptPaymentAmount < 0
                            ? '本期个人应付'
                            : '本期个人应收'
                    }} -->
                    本期个人应收/应付
                </span>
                <el-tooltip class="item" effect="dark" content="" placement="top-start">
                    <span slot="content">
                        <p v-if="
                            data.personShouldReceiptPaymentAmount <
                            0
                        ">
                            当期应收总额减去应付总额的差值；差值为负数时表示亏损
                            公式：应收上级+应收下级-应付上级-应付下级
                        </p>
                        <p v-else>
                            当期应收总额减去应付总额的差值；差值为正数时表示盈利
                            公式：应收上级+应收下级-应付上级-应付下级
                        </p>
                    </span>
                    <i class="el-icon-question"></i>
                </el-tooltip>
            </template>
            <template slot-scope="scope">
                {{ aomunt(personShouldReceiptPaymentAmount) }}
            </template>
        </el-table-column>
    </el-table>
</template>

<script>
import formItem from './formItem.vue'
import list from '@/mixins/list'
import mixin from './mixin'
export default {
    components: {
        formItem
    },
    mixins: [list, mixin],
    props: {
        data: {
            type: Object,
            default: () => ({})
        }
    },
    data() {
        return {
        }
    },
    computed: {
        personShouldReceiptPaymentAmount() {
            const { shouldReceiptPaymentParentAmount, shouldReceiptChildAmount, shouldPaymentChildAmount } = this.data
            if (!this.checkNums([shouldReceiptPaymentParentAmount, shouldReceiptChildAmount, shouldPaymentChildAmount])) {
                return '/'
            }
            return shouldReceiptPaymentParentAmount - shouldReceiptChildAmount - shouldPaymentChildAmount
        }
    }
}
</script>
